<template>
    <div>
        <el-dialog title="新增增补案件" :visible.sync="assignDialog" width="50%">
            <el-form label-width="130px" :rules="rules" :model="ruleForm" style="width: 80%;margin-left:40px;"
                size="small">
                <el-form-item label="报案号:" prop="caseNumber" required>
                    <el-input v-model="ruleForm.caseNumber"></el-input>
                </el-form-item>
                <el-form-item label="定损车号:" prop="carNumber" required>
                    <el-input v-model="ruleForm.carNumber"></el-input>
                </el-form-item>
                <el-form-item label="拆检点联系人:" prop="carNumber" required>
                    <el-input v-model="ruleForm.licensePersonName"></el-input>
                </el-form-item>
                <el-form-item label="拆检点联系电话:" prop="licensePersonPhone" required>
                    <el-input v-model="ruleForm.licensePersonPhone"></el-input>
                </el-form-item>
                <el-form-item label="定损地点:" prop="address" required>
                    <el-input v-model="ruleForm.address"></el-input>
                </el-form-item>
                <el-form-item label="估损金额:" prop="estimateMoney" required>
                    <el-input v-model="ruleForm.estimateMoney"></el-input>
                </el-form-item>
                <el-form-item label="定损时间:" prop="accidentTime" required>
                    <el-date-picker v-model="ruleForm.accidentTime" type="datetime" placeholder="选择日期时间">
                    </el-date-picker>
                </el-form-item>
                <el-form-item label="案件类型:" required>
                    <el-select v-model="ruleForm.caseType" placeholder="请选择案件类型">
                        <el-option label="标的" value="0"></el-option>
                        <el-option label="三者" value="1"></el-option>
                        <el-option label="人伤" value="2"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="事故类型:" required>
                    <el-select v-model="ruleForm.accidentType" placeholder="请选择事故类型">
                        <el-option label="水淹" value="0"></el-option>
                        <el-option label="火烧" value="1"></el-option>
                        <el-option label="碰撞" value="2"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="车辆类型:" required>
                    <el-select v-model="ruleForm.carType" placeholder="请选择车辆类型">
                        <el-option label="商用车" value="0"></el-option>
                        <el-option label="乘用车" value="1"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="事故经过:">
                    <el-input v-model="ruleForm.accident"></el-input>
                </el-form-item>
                <el-form-item label="估损金额:">
                    <el-input v-model="ruleForm.caseDesc"></el-input>
                </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
                <el-button @click="assignDialog = false">取 消</el-button>
                <el-button type="danger" @click="creatTask()">确 定</el-button>
            </span>
        </el-dialog>
    </div>
</template>
<script>
import { xiePeiCreateTask } from '@/api/case'
export default {
    data() {
        return {
            assignDialog: false,
            ruleForm: {
                caseType: '0',
                accidentType: '0',
                carType: '0',
                accidentTime: this.$dayjs().format('YYYY-MM-DD HH:mm:ss')
            },
            // 案件类型list
            caseTypeList: [
                {
                    value: '0',
                    label: '标的'
                },
                {
                    value: '1',
                    label: '三者'
                },
                {
                    value: '2',
                    label: '人伤'
                }
            ],
            rules: {
                caseNumber: [
                    { required: true, message: '请输入报案号', trigger: 'blur' },
                    { min: 22, max: 22, message: '报案号格式有误', trigger: 'blur' }
                ],
                carNumber: [
                    { required: true, message: '请输入车牌号', trigger: 'blur' },
                    { pattern: /^([京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领A-Z]{1}[a-zA-Z](([DF]((?![IO])[a-zA-Z0-9](?![IO]))[0-9]{4})|([0-9]{5}[DF]))|[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领A-Z]{1}[A-Z]{1}[A-Z0-9]{4}[A-Z0-9挂学警港澳]{1})$/, message: '车牌号格式不正确', trigger: 'blur' }
                ],
                licensePersonName: [
                    { required: true, message: '请输入拆检点联系人', trigger: 'blur' },
                ],
                licensePersonPhone: [
                    { required: true, message: '请输入拆检点联系电话', trigger: 'blur' },
                ],
                address: [
                    { required: true, message: '请输入定损地点', trigger: 'blur' },
                ],
                estimateMoney: [
                    { required: true, message: '请输入估损金额', trigger: 'blur' },
                ],
                accidentTime: [
                    { required: true, message: '请选择定损时间', trigger: 'blur' },
                ]
            },
        }
    },
    created() {
    },
    computed: {
    },
    methods: {
        creatTask() {
            xiePeiCreateTask(this.ruleForm).then(() => {
                this.assignDialog = false;
                this.ruleForm = {
                    caseType: '0',
                    accidentType: '0',
                    carType: '0',
                    accidentTime: this.$dayjs().format('YYYY-MM-DD HH:mm:ss')
                }
                this.$emit("search-list")
                this.$message({
                    message: '新增成功',
                    type: 'success'
                })
            })
        },
        showDialog() {
            this.assignDialog = true;
        }
    },
}
</script>
<style lang='scss' scoped>
::v-deep {

    .el-form-item .el-input,
    .el-form-item .el-select,
    .el-input-number--small {
        width: 85%;
    }

    .el-form-item .el-select {
        width: 100%;
    }
}
</style>
